﻿<Common:LayoutAwarePage
	x:Class="Coding4Fun.Toolkit.Test.WindowsStore.Samples.Buttons.Tiles"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:Common="using:Coding4Fun.Toolkit.Test.WindowsStore.Common"
    xmlns:Coding4Fun="using:Coding4Fun.Toolkit.Controls" 
	xmlns:c4fBinding="using:Coding4Fun.Toolkit.Controls.Binding">
	<Common:LayoutAwarePage.Resources>
		<Style x:Key="GridViewItemStyle1" TargetType="GridViewItem">
			<Setter Property="Background" Value="Transparent"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="GridViewItem">
						<ContentPresenter 
							ContentTransitions="{TemplateBinding ContentTransitions}" 
							HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
							Margin="{TemplateBinding Padding}"
							VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>

	</Common:LayoutAwarePage.Resources>

	<Grid Style="{StaticResource LayoutRootStyle}">
		
		<Grid.Triggers>
			<EventTrigger RoutedEvent="Grid.Loaded" >
				<BeginStoryboard>
					<Storyboard
						AutoReverse="True" 
						RepeatBehavior="Forever">
						<DoubleAnimationUsingKeyFrames 
							Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)"
							Storyboard.TargetName="img">
							<SplineDoubleKeyFrame KeyTime="0:0:1"/>
							<SplineDoubleKeyFrame KeyTime="0:0:36" Value="-307"/>
							<SplineDoubleKeyFrame KeyTime="0:0:37" Value="-307" />
						</DoubleAnimationUsingKeyFrames>
					</Storyboard>
				</BeginStoryboard>
			</EventTrigger>
		</Grid.Triggers>
        <Grid.RowDefinitions>
            <RowDefinition Height="140"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

		<Common:BaseHeader Title="Tiles" />

		<GridView
            AutomationProperties.AutomationId="ItemsGridView"
            AutomationProperties.Name="Items"
			ItemContainerStyle="{StaticResource GridViewItemStyle1}"
            TabIndex="1"
            Grid.Row="1"
            Padding="116, 0"
            SelectionMode="None"
            IsSwipeEnabled="false">
			<VariableSizedWrapGrid
				ItemHeight="10" 
				ItemWidth="10"
				MaximumRowsOrColumns="25">
			
				<Coding4Fun:Tile 
					VariableSizedWrapGrid.ColumnSpan="15"
					VariableSizedWrapGrid.RowSpan="15"
					Margin="0, 0, 10, 10"
					Label="Click Me"
					Click="TileClick">
						<Grid>
							<Image 
								Source="../../Media/headWhite_100.png" 
								Stretch="None" />
							<Coding4Fun:TileNotification  Content="99" />
						</Grid>
					</Coding4Fun:Tile>
					<Coding4Fun:Tile 
						VariableSizedWrapGrid.ColumnSpan="15"
						VariableSizedWrapGrid.RowSpan="15"
						Margin="0, 0, 10, 10"
						TextWrapping="Wrap"
						Label="Testing Text	 Wrapping">
						<Image 
							Source="../../Media/head.png" 
							Width="100"
							Height="100"/>
					</Coding4Fun:Tile>
				<Coding4Fun:Tile 
					VariableSizedWrapGrid.ColumnSpan="15"
					VariableSizedWrapGrid.RowSpan="15"
					Margin="0, 0, 10, 10"
					IsEnabled="False"
					Label="disabled" />
				<Coding4Fun:Tile 
					Width="400"
					VariableSizedWrapGrid.ColumnSpan="40"
					VariableSizedWrapGrid.RowSpan="15"
					Margin="0, 0, 10, 10"
					c4fBinding:FrameworkElementBinding.ClipToBounds="True"
					HorizontalAlignment="Left"
					Label="Coding4Fun Phone Toolkit">
					<Grid>
						<Canvas>
							<Image 
								Name="img" 
								Width="400"
	        					Source="../../Media/images/trex_360width.jpg" 
	        					Stretch="UniformToFill">
								<Image.RenderTransform>
									<CompositeTransform />
								</Image.RenderTransform>
							</Image>
						</Canvas>
						<Coding4Fun:TileNotification
									Padding="18, 0"
									Background="Orange">
							rawr?
						</Coding4Fun:TileNotification>
					</Grid>
				</Coding4Fun:Tile>

				<Coding4Fun:Tile 
					VariableSizedWrapGrid.ColumnSpan="30"
					VariableSizedWrapGrid.RowSpan="10"
					Margin="0, 0, 10, 10"
					
					Label="Coding4Fun Phone Toolkit">
					<Grid>
						<StackPanel 
									Orientation="Horizontal" 
									VerticalAlignment="Bottom"
									HorizontalAlignment="Right"
									Margin="12, 0">
							<TextBlock VerticalAlignment="Bottom">
										<Run>Fri</Run>
										<Run 
											FontSize="54"
											FontWeight="Bold">
											15
										</Run>
							</TextBlock>
						</StackPanel>
						<Coding4Fun:TileNotification
									Padding="0"
									Background="Transparent"
									HorizontalAlignment="Left"
									Margin="0">
							<StackPanel Orientation="Horizontal">
								<Image 
									Height="35"
									Stretch="Uniform"
									Source="../../Media/icons/appbar.share.rest.png" />
								<TextBlock 
									VerticalAlignment="Center">
									Birthday
								</TextBlock>
							</StackPanel>
						</Coding4Fun:TileNotification>
					</Grid>
				</Coding4Fun:Tile>
				<Coding4Fun:Tile 
					VariableSizedWrapGrid.ColumnSpan="40"
					VariableSizedWrapGrid.RowSpan="10"
					Margin="0, 0, 10, 10"
					c4fBinding:FrameworkElementBinding.ClipToBounds="True"
					Background="Orange"
					FontSize="28"
					Foreground="SlateBlue"
					Label="Coding4Fun Phone Toolkit">
					<Image 
							HorizontalAlignment="Right"
							Source="../../Media/headWhite.png" 
							Stretch="Uniform" 
							Height="150"
							Width="150"
							Margin="0, -25, -28, 0" />
				</Coding4Fun:Tile>
			</VariableSizedWrapGrid>
		</GridView>
	</Grid>
</Common:LayoutAwarePage>